<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>EventSource example</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <script src="eventsource-polyfill.js"></script>
    <script>
        var es = new EventSourcePolyfill("http://localhost:8080/demo-2-sse?connectionId=qwer", {
            headers: {
                'userId': '1' // 设置请求头需要 eventsource-polyfill.js
            }
        });
        var listener = function (event) {
            var div = document.createElement("div");
            var type = event.type;
            div.appendChild(document.createTextNode(type + "事件：" + (type === "message" ? event.data : es.url)));
            document.body.appendChild(div);
        };
        es.addEventListener("open", listener);
        es.addEventListener("message", listener);
        es.addEventListener("error", listener);


        function closeEventSource() {
            if (es) {
                es.close();
                console.log('EventSource connection closed.');
            }
        }
    </script>
</head>
<button id="closeButton" onclick="closeEventSource()">客户端主动关闭连接</button>
<body>
</body>
</html>

